<template lang="html" >
	<div class="html_a">	
		
		<van-nav-bar
		  title="购买宝贝"
		  left-arrow
		  @click-left="onClickLeft"
		>		
		  <van-icon name="arrow-left" slot="left" color="#000" size="20"/>
	    </van-nav-bar>
	    
	    <div class="wrap">
	      <!--商品详情--> 	
	      
	      
	      	      
          <floor2 :goodsInfo="goodsInfo" @changeBuyNumber="changeBuyNumber" v-if="!hasOrdersId"></floor2>
          
          
          <floor65 :ordersInfo="ordersInfo" :goods="goods" v-if="hasOrdersId"></floor65>
          
          <div style="height: 10px;"></div>
          
          <div class="otherInfo">
          	
          	 <div class="address" v-if="hasAddress==1" @click="addressClick">
          	 	<div class="address_left">收货地址</div>
          	 	<div class="address_middle">
          	 		<div class="word" style="margin-bottom: 10px;">{{addressInfo.addressAreaInfo}} {{addressInfo.address}}</div>
          	 		<div class="word" >收货人：{{addressInfo.addressRealName}} {{formatTelphone(addressInfo.addressMobile)}}</div>
          	 	</div>
          	 	<div class="address_right">
          	 		<img src="../../../../static/img/lanhu/83.png" alt="" />
          	 	</div>
          	 </div>
          	 
          	 
          	 <div class="no_address address" v-if="hasAddress==0" @click="addressClick"> 
          	 	<div class="address_left">收货地址</div>
          	 	<div class="address_middle">
          	 		<div class="word">请选择收货地址</div>
          	 	</div>
          	 	<div class="address_right">
          	 		<img src="../../../../static/img/lanhu/83.png" alt="" />
          	 	</div>
          	 </div>   

          	 <div class="address" style="border-bottom: none;" v-if="!hasOrdersId">
          	 	<div class="address_left">运费</div>
          	 	<div class="address_right">
          	 		<span style="font-weight: bold;font-size: 13px;color: #F22613;" 
          	 			v-if="goodsInfo.comIsdistance>0">
          	 			¥ {{formatFixed2(freight)}}
          	 		</span>
          	 	    <span style="font-size: 13px;color: #999;" v-if="goodsInfo.comIspost>0">¥ 包邮</span>
                    <span style="font-weight: bold;font-size: 13px;color: #F22613;" 
                    	v-if="goodsInfo.comIspost==0&&goodsInfo.comIsdistance==0">
                    	¥ {{formatFixed2(freight)}}
                    </span>
          	 	</div>
          	 </div> 
          	 
          	 <div class="address" style="border-bottom: none;" v-if="hasOrdersId">
          	 	<div class="address_left">运费</div>
          	 	<div class="address_right">
          	 		<span style="font-weight: bold;font-size: 13px;color: #F22613;" 
          	 			>
          	 			¥ {{formatFixed2(ordersInfo.goodsFreight/ordersInfo.goodsCount)}}
          	 		</span>

          	 	</div>
          	 </div>          	 
          	 
          	 
          </div>
	      <div style="padding: 10px 20px;color: #999;" v-if="goodsInfo.comIsdistance>0">此商品按距离计算。20元/百公里/件</div>
	    </div>
	    

		
        <div class="info_footer">
        	<div class="info">
        		<span style="font-size: 15px;font-weight: bold;margin-right: 4px;">实付款</span>
        		<span style="font-size: 12px;color: #666;">(售价+运费)*数量</span>
        		<span>：</span>
        		<span style="color: #F22613;margin-left: 4px;font-weight: bold;font-size: 15px;" v-if="!hasOrdersId">¥ {{needPay}}</span>
        	    <span style="color: #F22613;margin-left: 4px;font-weight: bold;font-size: 15px;" v-if="hasOrdersId">¥ {{formatFixed2(ordersInfo.goodsFreight+ordersInfo.ordersPrice)}}</span>
        	</div>
        	<van-button  :loading="btnLoading" color="#FFD630" @click="confirm" v-if="btnStatus==1&&!hasOrdersId" style="width: 100px;color: #333;">确认</van-button>
        	<div class="confirm active"  v-else-if="btnStatus==1&&hasOrdersId">确认</div>
        	<div class="confirm active"  v-else-if="btnStatus==2">已下架</div>
        	<div class="confirm active"  v-else-if="btnStatus==3">已售出</div>
        	<div class="confirm active"  v-else-if="btnStatus==4">已删除</div>
        </div> 			
        
        <confirm ref="confirm" @queryConfirm="queryConfirm" 
        	confirmTitle="价格变动"
        	:price1="goodsInfo.comPrice"
        	:price2="newComPrice"
        	></confirm>
        
        
        
        
		<van-popup
		  v-model="showAddressList"		  
		  position="right"
		  :style="{ height: '100%',width:'100%'}"
		  :overlay="false"
		>	
		  <floor51 @hiddenPopup="showAddressList=false" @reload="changeAddress"></floor51>
		</van-popup>
	</div>
</template>                                                                

<script>
import Floor2 from '_c/market/floor/floor02.vue'
import Floor51 from '_c/market/floor/floor51.vue'
import Floor65 from '_c/market/floor/floor65.vue'
import confirm from '_c/market/confirm3.vue'
import {getFun} from '@/api/publicFun.js'	 
let publicFun=getFun()
export default {
	name: 'goodsInfo',	
	components: {
	   Floor51,Floor2,confirm,Floor65
	},	
	data() {
       return {
       	   hasOrdersId:false,  // 是否含有订单
       	   value:1,
       	   btnLoading:false,    // 记录生成订单按钮是否在加载状态
       	   showAddressList:false,    // 显示地址列表
           goodsInfo:{},             // 用于绑定商品详情
           ordersInfo:{},            // 用于绑定有订单下的商品详情
           goods:{},
           addressInfo:{},           // 默认地址详情
           hasAddress:-1,            // 是否存在默认地址
           userId:'',                // 用户ID
           comId:'',                 // 商品ID
           url1:this.$api+'/marketorderservice/api/v1/market/goods', // 请求商品详情的接口
           url2:this.$api+'/marketorderservice/api/v1/market/address/list',// 请求默认地址接口
           url3:this.$api+'/marketorderservice/api/v1/market/getGoodsFreight', // 计算运费
           url4:this.$api+'/marketorderservice/api/v1/market/addOrders',  // 生成订单
           url5:this.$api+'/marketorderservice/api/v1/market/checkingGoodsPrice',  // 检测当前价格是否发生变动
           url6:this.$api+'/marketorderservice/api/v1/market/getIsExistOrder',
           goodsCount:0,            // 剩余库存
           comPrice:0,              // 商品单价
           freight:0,               // 运费(单件商品)
           buyNumber:1,             // 购买数量 初始化为1
           computerPrice:0,         // 距离计算运费
           goodsState:'1',          // 商品状态  
           btnStatus:1,             // 按钮状态
           newComPrice:0            // 改变后的价格
       }
	},		
	computed: {
	    // 计算还需支付
	    needPay:function(){
            return ((this.comPrice+this.freight)*this.buyNumber).toFixed(2)
	    },
	    max:function(){
	       if(this.goodsInfo.limitCount==-1&&this.goodsInfo.goodsCount>0){
	       	 return this.goodsInfo.goodsCount
	       }
	       if(this.goodsInfo.limitCount>0&&this.goodsInfo.goodsCount==-1){
	       	 return this.goodsInfo.limitCount
	       }
	       if(this.goodsInfo.limitCount>0&&this.goodsInfo.goodsCount>0){
	       	 return this.goodsInfo.goodsCount>=this.goodsInfo.limitCount?this.goodsInfo.limitCount:this.goodsInfo.goodsCount
	       }	       
	    }		    
	},    
	methods: {	
		addressClick(){
			if(this.hasOrdersId){
				return false
			}else{
				this.showAddressList=true
			}			
		},
		// 确认生成订单
		confirm(){
			if(!this.addressInfo.addressId){
				this.$toast('请选择收货地址')
				return false
			}
			let pay=this.needPay
			if(pay<0.5){
				this.$toast('支付价格不能低于0.50元')
				return false				
			}
			let that=this
			this.$Axios.Get(this.url5+'/'+this.goodsInfo.comPrice+'/'+this.comId).then(function(res){
				if(res.data.flag){
					that.createOrder()
				}else{
					that.newComPrice=res.data.newComPrice
				    that.$refs.confirm.showWin() 
				}
			})
		},
		// 价格发生改动后 确认支付
		queryConfirm(){
			this.createOrder()
		},
		// 生成订单
		createOrder(){
			let that=this
			let params={
				userId:this.userId,
				addressId:this.addressInfo.addressId,
				goodsCount:this.buyNumber,
				goodsId:this.comId,
				tuserId:'',
				ordersPrice:this.needPay
			}			
			this.btnLoading=true
			this.$Axios.Post(this.url4,params).then(function(res){
				that.btnLoading=false
				if(res.responseCode==100){					
					let ordersId=res.data.ordersId
					let arg='[{"ordersId":"'+ordersId+'"}]' 
					that.link('/market/orderPay/orderInfo',arg)
				}else{
				    that.$dialog.alert({
				      message: res.messageList[0].message,
				    })				
				}
			})			
		},
		// 改变地址 需要重新计算运费
		changeAddress(){
			this.init()
		},
		// 改变数量
		changeBuyNumber(num){
			this.buyNumber=num;
			if(this.goodsInfo.comIsdistance>0){				
				this.freight=this.computerPrice
			}
		},
		// 判断是否生成过订单 如果有的话 需要初始化订单信息 
		getOrdersInfo(){
            let that=this
	        this.$Axios2.Get(this.url6+'/'+this.userId+'/'+this.comId).then(function(res){
	        	let result=JSON.stringify(res.data.orders)
	        	if(result!=='{}'){
	        		that.hasOrdersId=true
	        		// console.log(res.data)
	        		// =====请求默认地址=====
			        let params={			
					  "addressIsDefault": 1,
					  "userId":that.userId
					}	        
                    that.$Axios2.Post(that.url2,params).then(function(res) {	                      
				       if(res.data.length>0){
				         that.addressInfo=res.data[0] 
				         that.hasAddress=1
				       }else{
				       	 that.hasAddress=0
				       }                    
                    })
                  
                    // =====请求默认地址=====
                    that.ordersInfo=res.data.orders
                    that.goods=res.data.goods   
	        	}else{
	        		that.hasOrdersId=false
	        		that.init()
	        	}
	        })			
		},
		// 生成订单后的具体信息
		
	    // 页面初始化
	    init(){
	    	let that=this
	        let params={			
			  "addressIsDefault": 1,
			  "userId":this.userId
			}
		    this.$Axios2.Post(this.url2,params)
		    .then(function(res) {	
		       if(res.data.length>0){
		         that.addressInfo=res.data[0] 
		         that.hasAddress=1
		       }else{
		       	 that.hasAddress=0
		       }
		       // 请求商品详情
		       that.$Axios2.Get(that.url1+'/'+that.comId+'/'+that.userId).then(function(res) {	
			       that.goodsInfo=res.data
			       that.goodsCount=res.data.goodsCount
			       that.comPrice=res.data.comPrice	
			       that.freight=res.data.freight
			       that.goodsState=res.data.goodsState
			       if(that.goodsState==3){
			    		that.btnStatus=2
			       }else if(that.goodsCount==0){
			    		that.btnStatus=3
			       }		       
			       if(res.data.comIsdistance>0){
			       	  if(that.hasAddress){
			       	  	  let goodsCount=that.buyNumber;
			       	  	  let goodsId=that.comId;
			       	  	  let addressId=that.addressInfo.addressId;
			       	  	  that.$Axios2.Get(that.url3+'/'+goodsId+'/'+addressId).then(function(res) {	
			       	  	  	 that.computerPrice=res.data
			       	  	  	 that.freight=that.computerPrice
			       	  	  })			       	  	  			       	  	  
			       	  }else{
			       	  	  that.freight=0
			       	  }
			       }else{
			       	  that.freight=res.data.freight
			       }
		       })
		    })				       
	    }
	},
	mixins:[publicFun],//混入
	mounted() {
		this.comId=this.$router.currentRoute.query.comId;
		this.userId=this.$router.currentRoute.query.userId;	
		this.getOrdersInfo()
		
	}
}
</script>

<style scoped lang="scss">
.van-button__text{color: #333;}
.van-button{border-radius: 0;}
.html_a{background: #f8f8f8;min-height: 100%;width: 100%;position: absolute;}
.wrap{padding: 10px 0 60px;}

.otherInfo{padding: 0 20px;background: #fff;}


.address{display: flex;justify-content:space-between;align-items: center;padding: 20px 0;border-bottom:1px solid #f0f0f0 ;
  .address_left{font-size: 13px;font-weight: bold;}
  .address_right img{width: 7px;}
  .address_middle{flex: 1;padding: 0 15px 0 50px;
    .word{text-align: right;color: #999;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;overflow: hidden;}
  }
}
.info_footer{position:fixed;display: flex;width: 100%;background: #fff;justify-content: space-between;bottom: 0;left: 0;
   .confirm{padding: 15px 30px;background: #FFD630;}
   .confirm.active{background: #999;color: #fff;}
   .info{display: flex;align-items: center;flex: 1;padding-left: 20px;}
}
</style>